<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>瑞智停</title>
    <!-- 引入外部 CSS 文件 -->
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="container">
        <div class="left-panel">
            <div class="speed-info">
                <h2>瑞智停</h2>
                <div class="speed-value">
                    <span id="speed">0</span>
                    <span class="unit">m/s</span>
                </div>
            </div>
            <div id="canvas-container">
                <canvas id="radarCanvas"></canvas>
                <img id="car-img" src="./car.png" alt="car" />
            </div>
        </div>
        <div class="right-panel">
            <div class="camera-view" id="camera-view">
                <div class="camera-placeholder">摄像头关闭</div>
                <img id="camera-feed" src="" alt="车位照片" />
            </div>
            <div class="control-panel">
                <button id="find-spot-btn" class="main-btn">寻找车位</button>
                <div class="parking-spots">
                    <button id="spot-1" class="spot-btn disabled">车位1</button>
                    <button id="spot-2" class="spot-btn disabled">车位2</button>
                    <button id="spot-3" class="spot-btn disabled">车位3</button>
                </div>
            </div>
        </div>
    </div>
    
    <!-- 用于显示参数的DIV -->
    <div id="secret-code-display">00</div>

    <!-- 引入外部 JavaScript 文件 (通常放在 body 结束前) -->
    <script src="script.js"></script>
</body>
</html>